<template>
  <div class="error-list">
    <leave-crud title="访问记录" :url="url" :searchOption="searchOption" :cutOperation="['view', 'create', 'edit']">
      <template slot="tableRows">
        <el-table-column prop="path" label="请求路径"></el-table-column>
        <el-table-column
          prop="state"
          label="操作结果"
          :filters="[
            { text: '成功', value: [200, 201, 204] },
            { text: '失败', value: [500, 302, 503, 504] },
            { text: '无权限', value: [401, 403] },
            { text: '未命中', value: [404] },
          ]"
          :filter-method="filterResult">
        </el-table-column>
        <el-table-column
          prop="method"
          label="请求操作"
          :filters="[
            { text: '获取数据', value: 1 },
            { text: '创建数据', value: 2 },
            { text: '更新数据', value: 3 },
            { text: '删除数据', value: 4 },
            { text: '其他', value: 5 },
          ]"
          :filter-method="filterMethod">
          <template slot-scope="props">
            {{ method[props.row.method] || '其他' }}
          </template>
        </el-table-column>
        <el-table-column prop="username" label="所属用户"></el-table-column>
        <el-table-column
          prop="spm"
          label="来源"
          :filters="[{ text: '外部应用', value: 1 }, { text: '管理系统', value: 2 }, { text: '其他', value: 3 }, ]"
          :filter-method="(value, row) => value === row.spm">
          <template slot-scope="props">
            {{ spm[props.row.spm] || '其他' }}
          </template>
        </el-table-column>
        <el-table-column prop="createdAt" label="创建时间" min-width="110px">
          <template slot-scope="props">
            {{ props.row.createdAt | date }}
          </template>
        </el-table-column>
      </template>
    </leave-crud>
  </div>
</template>


<script>
  export default {
    name: 'error-list',
    data() {
      return {
        url: '/log',
        method: { 1: '获取数据', 2: '创建数据', 3: '更新数据', 4: '删除数据', 5: '其他' },
        spm: { 1: '外部应用', 2: '管理系统', 3: '其他' },
        searchOption: [
          {
            'key': 'path',
            'label': '请求路径',
          },
          {
            'key': 'state',
            'label': '请求状态',
          },
          {
            'key': 'username',
            'label': '所属用户',
          },
        ],
      }
    },
    methods: {
      // 模块过滤
      filterModule(value, row) {
        return row.module.includes(value)
      },
      filterResult(value, row) {
        return value.includes(row.state)
      },
      filterMethod(value, row) {
        return value === row.method
      },
    },
    created() {},
  }
</script>


<style lang="scss">
  .error-list {
  }
</style>
